@import '../../../../../assets/scss/px_function.scss';

.mt-chat {
  
  &__footer {
    min-height: px(100);
    width: 100%;
    background-color: #fff;

    &__action {
      min-height: px(100);

      &__item {
        height: px(100);

        &__icon {
          width: px(52);
          height: px(52);
        }
      }

      &__send {
        width: px(70);
        height: px(50);
        background-color: #00a2f1;
        border-radius: px(30);
      }
    }

    &__input {
      vertical-align: middle;
      width: px(480);
      min-height: px(60);
      padding: 0 px(8);
      font-size: px(32);
      overflow: hidden;

      &__body {
        min-height: px(100);
        padding: px(16) 0;
      }
    }

    &__emotion {
      height: px(375);
      background-color: #fff;
      border-top: px(1) solid #999;
    }

    &__extra {
      height: px(375);
      background-color: #f0f0f0;
      border-top: px(1) solid #999;
      padding: px(20) 0;

      &__button {
        width: 25%;
        align-items: center;
        align-content: center;

        &__item {
          width: px(100);
          height: px(100);
          border-width: px(1);
          background-color: #fff;
          border-color: #ccc;
          border-radius: px(6);
        }

        &__icon {
          width: px(60);
          height: px(60);
        }
      }
    }

  }
}
